const isProd = process.env.NODE_ENV === `production`
let externals = {}
let cdn = {css: [], js: []}
if (isProd) {
  externals = {
    /**
     * externals 对象属性解析：
     * '包名' : '在项目中引入的名字'
     */
    'vue': 'Vue',
    'element-ui': 'Element',
    'vuex': 'Vuex',
    'vue-router': 'VueRouter',
    'axios': 'axios',
    'prettier/standalone': 'prettier',
    'highlight.js': 'hljs',
  }
  cdn = {
    css: ['https://cdn.staticfile.org/element-ui/2.15.7/theme-chalk/index.min.css'],
    js: ['https://cdn.staticfile.org/vue/2.6.14/vue.min.js',
      'https://cdn.staticfile.org/vue/2.6.14/vue.runtime.min.js',
      'https://cdn.staticfile.org/vue-router/3.5.3/vue-router.min.js',
      'https://cdn.staticfile.org/vuex/3.6.2/vuex.min.js',
      'https://cdn.staticfile.org/axios/0.24.0/axios.min.js',
      'https://cdn.staticfile.org/element-ui/2.15.7/index.min.js',
      'https://cdn.staticfile.org/prettier/2.5.1/standalone.min.js',
      'https://cdn.staticfile.org/highlight.js/11.4.0/highlight.min.js',
    ]
  }
}

module.exports = {

  devServer: {
    proxy: {
      '/app': {
        target: isProd ? 'https://blog.zealsay.com' : 'http://localhost:8010',  // 后台接口域名
        ws: true,        //如果要代理 websockets，配置这个参数
        secure: false,  // 如果是https接口，需要配置这个参数
        changeOrigin: true,  //是否跨域
        pathRewrite: {
          '^/app': '/'
        }
      }
    }
  },
  publicPath: process.env.SERVER_ENV === `NETLIFY` ? `/` : `/md/`, // 基本路径, 建议以绝对路径跟随访问目录
  configureWebpack: (config) => {
    config.module.rules.push({
      test: /\.(txt|md)$/i,
      use: [{
        loader: 'raw-loader',
      }]
    });

    if (isProd) {
      // 用cdn方式引入
      config.externals = externals
    }

  },
  chainWebpack(config) {

    config.plugin('preload').tap(() => [
      {
        rel: 'preload',
        fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
        include: 'initial'
      }
    ])
    // 移除 prefetch 插件
    // config.plugins.delete('prefetch');

    // 注入cdn变量 (打包时会执行)
    config.plugin('html').tap(args => {
      args[0].cdn = cdn // 配置cdn给插件
      return args
    })


    // 省略其他...
  },
  filenameHashing: false,
  productionSourceMap: !isProd,
  css: {
    sourceMap: !isProd,
  },
}
